<template>
	<view class="administration">
		<view class="head-box w100">
			<view style="padding: 20rpx 32rpx">
				<view class="personal_box">
					<view class="bjt">
						<view class="flexjus head_img">
							<view class="personal_left_img flex">
								<view class="avatar_box">
									<image class="avatar w100 h100" :src="userInfo.avatar"></image>
								</view>
								<view class="name_detail_box">
									<view class="name_txt family s30 f500">
										{{ userInfo.name ? userInfo.name : userInfo.nickname }}
									</view>
									<view class="flex" style="line-height: 36rpx">
										<view class="detail_box familythree f400 s26">
											<block v-if="userInfo.identity == 1">注册会员</block>
											<block v-else-if="userInfo.identity == 2">店铺会员</block>
											<block v-else-if="userInfo.identity == 3">{{ userInfo.position }}</block>
											<block v-else-if="userInfo.identity == 4">城市合伙人</block>
											<block v-else-if="userInfo.identity == 5">店铺合伙人</block>
										</view>
										<view class="position_txt familythree f400 s26">
											{{ userInfo.work }}
										</view>
									</view>
								</view>
							</view>
							<view class="personal_right_logo">
								<image class="w100 h100" :src="icon.hyjLogo"></image>
							</view>
						</view>
						<view style="padding: 16rpx 0; color: #fff; font-size: 22rpx">
							<text>购买人数:{{ array[index].worker_num }}</text>
							<text style="margin-left: 8rpx">合同到期时间:{{ array[index].fee_end_time }}</text>
						</view>
					</view>
				</view>
			</view>
			<view class="store_box flex" @click="isRotate = !isRotate" style="align-items: center">
				<view class="store_logo">
					<image class="w100 h100" :src="icon.storeLogo"></image>
				</view>
				<picker @change="bindPickerChange" @cancel="cancelPicker" :range-key="'shopname'" :value="index" :range="array" style="width: 100%">
					<view class="" style="display: flex; align-items: center">
						<view class="uni-input s24 family f500">{{ array[index].shopname }}</view>
						<view class="senior_txt family s24 f500">高级版</view>
						<view class="arrows_icon" style="font-size: 0; margin-right: 20rpx">
							<image :style="isRotate ? 'transform: rotate(180deg)' : ''" class="w100 h100" :src="icon.arrows"></image>
						</view>
					</view>
				</picker>
			</view>
		</view>
		<view class="list">
			<navigator
				v-if="userInfo.positions == 2 || (userInfo.positions == 1 && userInfo.is_palm_management == 1)"
				:url="`../orderManagement/orderManagement?shopId=${obj.shopId}&index=${obj.index}&shopType=${shopType}`"
			>
				<view class="list_box flex">
					<view class="list_icon">
						<image class="w100 h100" :src="icon.orderIcon"></image>
					</view>
					<view class="list_detail">
						<view class="title_box family f500 s30">订单管理</view>
						<view class="introduce_txt s26 familythree f400">订单查询管理、流程管理</view>
					</view>
					<view class="jian_right_icon">
						<u-badge type="error" :value="objData.order_count" max="99"></u-badge>
						<uni-icons type="right" size="16" color="#666" style="font-weight: bold"></uni-icons>
					</view>
				</view>
			</navigator>
			<block v-if="userInfo.positions == 2">
				<navigator :url="`/pages/bulletinBoard/bulletinBoard?type=3&obj=${JSON.stringify(obj)}`">
					<view class="list_box flex">
						<view class="list_icon">
							<image class="w100 h100" :src="icon.merchantsIcon"></image>
						</view>
						<view class="list_detail">
							<view class="title_box family f500 s30">商家职员看板</view>
							<view class="introduce_txt s26 familythree f400">返利状况查询</view>
						</view>
						<view class="jian_right_icon">
							<uni-icons type="right" size="16" color="#666" style="font-weight: bold"></uni-icons>
						</view>
					</view>
				</navigator>
				<navigator :url="`/pages/bulletinBoard/bulletinBoard?type=2&obj=${JSON.stringify(obj)}`">
					<view class="list_box flex">
						<view class="list_icon">
							<image class="w100 h100" :src="icon.rebateIcon"></image>
						</view>
						<view class="list_detail">
							<view class="title_box family f500 s30">店铺会员看板</view>
							<view class="introduce_txt s26 familythree f400">返利状况查询</view>
						</view>
						<view class="jian_right_icon">
							<uni-icons type="right" size="16" color="#666" style="font-weight: bold"></uni-icons>
						</view>
					</view>
				</navigator>
				<navigator :url="`/pages/bulletinBoard/bulletinBoard?type=4&obj=${JSON.stringify(obj)}`">
					<view class="list_box flex">
						<view class="list_icon">
							<image class="w100 h100" :src="icon.partnerIcon"></image>
						</view>
						<view class="list_detail">
							<view class="title_box family f500 s30">城市合伙人看板</view>
							<view class="introduce_txt s26 familythree f400">返利状况查询</view>
						</view>
						<view class="jian_right_icon">
							<uni-icons type="right" size="16" color="#666" style="font-weight: bold"></uni-icons>
						</view>
					</view>
				</navigator>
				<navigator :url="`/pages/bulletinBoard/bulletinBoard?type=5&obj=${JSON.stringify(obj)}`">
					<view class="list_box flex">
						<view class="list_icon">
							<image class="w100 h100" :src="icon.storePartnerIcon"></image>
						</view>
						<view class="list_detail">
							<view class="title_box family f500 s30">店铺合伙人看板</view>
							<view class="introduce_txt s26 familythree f400">返利状况查询</view>
						</view>
						<view class="jian_right_icon">
							<uni-icons type="right" size="16" color="#666" style="font-weight: bold"></uni-icons>
						</view>
					</view>
				</navigator>
			</block>
			<block v-if="(userInfo.positions == 2 && is_photography == 1) || (is_photography == 1 && userInfo.is_palm_management == 1 && userInfo.positions == 1)">
				<navigator :url="`/pages/schedule/schedule?obj=${JSON.stringify(obj)}`">
					<view class="list_box flex">
						<view class="list_icon">
							<image class="w100 h100" :src="icon.scheduleIcon"></image>
						</view>
						<view class="list_detail">
							<view class="title_box family f500 s30">档期管理</view>
							<view class="introduce_txt s26 familythree f400">查看安排摄影师、化妆师档期</view>
						</view>
						<view class="jian_right_icon">
							<uni-icons type="right" size="16" color="#666" style="font-weight: bold"></uni-icons>
						</view>
					</view>
				</navigator>
			</block>
			<block v-if="userInfo.positions == 2">
				<navigator :url="`/pages/schedule/employeeManagement?obj=${JSON.stringify(obj)}`">
					<view class="list_box flex">
						<view class="list_icon">
							<image class="w100 h100" :src="icon.employeesIcon"></image>
						</view>
						<view class="list_detail">
							<view class="title_box family f500 s30">员工管理</view>
							<view class="introduce_txt s26 familythree f400">权限/新增/离职/交接</view>
						</view>
						<view class="jian_right_icon">
							<uni-icons type="right" size="16" color="#666" style="font-weight: bold"></uni-icons>
						</view>
					</view>
				</navigator>
				<navigator v-if="userInfo.positions == 2 || (userInfo.positions == 1 && userInfo.is_palm_management == 1)">
					<view class="list_box flex" @click.stop="onBusiness">
						<view class="list_icon">
							<image class="w100 h100" :src="icon.informationIcon"></image>
						</view>
						<view class="list_detail">
							<view class="title_box family f500 s30">客资管理</view>
							<view class="introduce_txt s26 familythree f400">推荐客资的跟进结果及详情记录</view>
						</view>
						<view class="jian_right_icon">
							<u-badge type="error" :value="objData.customer_kz_count" max="99"></u-badge>
							<uni-icons type="right" size="16" color="#666" style="font-weight: bold"></uni-icons>
						</view>
					</view>
				</navigator>
			</block>
			<navigator>
				<view class="list_box flex" @click.stop="kezixiangqing">
					<view class="list_icon">
						<image class="w100 h100" :src="icon.informationDetailIcon"></image>
					</view>
					<view class="list_detail">
						<view class="title_box family f500 s30">客资详情</view>
						<view class="introduce_txt s26 familythree f400">推荐客资的审核及客资跟进分配</view>
					</view>
					<view class="jian_right_icon">
						<u-badge type="error" :value="objData.customer_count" max="99"></u-badge>
						<uni-icons type="right" size="16" color="#666" style="font-weight: bold"></uni-icons>
					</view>
				</view>
			</navigator>
			<block v-if="userInfo.positions == 2 || (userInfo.positions == 1 && userInfo.is_palm_management == 1)">
				<navigator :url="`/pages/schedule/addRebate?obj=${JSON.stringify(obj)}`">
					<view class="list_box flex">
						<view class="list_icon">
							<image class="w100 h100" :src="icon.rebateMemberIcon"></image>
						</view>
						<view class="list_detail">
							<view class="title_box family f500 s30">店铺会员管理</view>
							<view class="introduce_txt s26 familythree f400">添加店铺会员</view>
						</view>
						<view class="jian_right_icon">
							<uni-icons type="right" size="16" color="#666" style="font-weight: bold"></uni-icons>
						</view>
					</view>
				</navigator>
			</block>
			<block v-if="userInfo.positions == 2">
				<navigator @click="handleFinishParent" :url="`/pages/schedule/partnerManagement?obj=${JSON.stringify(obj)}`">
					<view class="list_box flex">
						<view class="list_icon">
							<image class="w100 h100" :src="icon.shopPartnerManagementIcon"></image>
						</view>
						<view class="list_detail">
							<view class="title_box family f500 s30">店铺合伙人管理</view>
							<view class="introduce_txt s26 familythree f400">通过/数据/排行</view>
						</view>
						<view class="jian_right_icon">
							<u-badge type="error" :value="objData.parent_count" max="99"></u-badge>
							<uni-icons type="right" size="16" color="#666" style="font-weight: bold"></uni-icons>
						</view>
					</view>
				</navigator>
			</block>
			<block v-if="userInfo.positions == 2">
				<view class="list_box flex" @click="gotoOrderSh">
					<view class="list_icon">
						<image class="w100 h100" src="@/static/orderSh.png"></image>
					</view>
					<view class="list_detail">
						<view class="title_box family f500 s30">订单推荐审核</view>
						<view class="introduce_txt s26 familythree f400">订单推荐审核</view>
					</view>
					<view class="jian_right_icon">
						<u-badge type="error" :value="objData.recommen_count" max="99"></u-badge>
						<uni-icons type="right" size="16" color="#666" style="font-weight: bold"></uni-icons>
					</view>
				</view>
				<view @click="handleFinishRecharge">
					<view class="list_box flex">
						<view class="list_icon">
							<image class="w100 h100" src="@/static/memberManager.png"></image>
						</view>
						<view class="list_detail">
							<view class="title_box family f500 s30">会员充值管理</view>
							<view class="introduce_txt s26 familythree f400">会员充值管理</view>
						</view>
						<view class="jian_right_icon">
							<u-badge type="error" :value="objData.recharge_count" max="99"></u-badge>
							<uni-icons type="right" size="16" color="#666" style="font-weight: bold"></uni-icons>
						</view>
					</view>
				</view>
				<navigator :url="`/pages/news/sanqi/tuijianshangjiaruzhu?obj=${JSON.stringify(obj)}&name=${array[index].shopname}`">
					<view class="list_box flex">
						<view class="list_icon">
							<image class="w100 h100" :src="icon.tuijianshangjiaruzhu"></image>
						</view>
						<view class="list_detail">
							<view class="title_box family f500 s30">推荐商家入住</view>
							<view class="introduce_txt s26 familythree f400">推荐商家入住可获得20%的奖励</view>
						</view>
						<view class="jian_right_icon">
							<uni-icons type="right" size="16" color="#666" style="font-weight: bold"></uni-icons>
						</view>
					</view>
				</navigator>
			</block>
		</view>
	</view>
</template>

<script>
import { mapState } from 'vuex';
export default {
	data() {
		return {
			height: true,
			heightTwo: true,
			teamList: {},
			userInfo: {},
			objData: null,
			shopList: {},
			array: [],
			index: 0,
			is_photography: 0, //0普通店铺 1婚纱店铺  ---------  'aaa';
			obj: {}, //其他用店铺id页面的传参  ----------  ''
			isRotate: false,
			shopType: 0
		};
	},
	computed: {
		...mapState(['icon'])
	},
	onLoad() {
		this.getShopList();
		this.getRebate();
	},
	methods: {
		// 获取消息来判断是否显示消息提示
		getNotice(id) {
			this.$request({
				url: 'manage/getnotice',
				method: 'post',
				data: {
					shop_id: id
				}
			}).then((res) => {
				const { code, data } = res.data;
				if (code == 1) {
					this.objData = data;
				}
			});
		},
		// 客资详情
		kezixiangqing() {
			this.$request({
				url: 'manage/setnotice',
				method: 'post',
				data: {
					shopId: this.shopList.id,
					type: 'customer'
				}
			}).then((res) => {
				const { code } = res.data;
				if (code == 1) {
					if (this.userInfo.identity == 3 && this.userInfo.positions == 1) {
						// 职员
						this.obj.isJob = 1;
					}
					uni.navigateTo({
						url: '/pages/filePages/myClient/myClient?obj=' + JSON.stringify(this.obj)
					});
					return;

					if (this.userInfo.positions == 2) {
						// 商家管理
						uni.navigateTo({
							url: `/pages/filePages/membershipPage/recommend?obj=${JSON.stringify(this.obj)}`
						});
					} else {
						// 商家职员（非商家管理）
						uni.navigateTo({
							url: '/pages/filePages/myClient/myClient?obj=' + JSON.stringify(this.obj)
						});
					}
				}
			});
		},
		getMemberData(id) {
			let that = this;
			that
				.$request({
					url: 'member/getInfo',
					method: 'POST',
					data: {
						shop_id: id
					}
				})
				.then((res) => {
					if (res.statusCode == 200) {
						that.userInfo = res.data.data;
						that.shopType = that.userInfo.shop[that.index].is_photography;
						uni.setStorageSync('identity', res.data.data.identity);
						uni.setStorageSync('shopId', id);
					}
				});
		},
		//收起选择店铺
		cancelPicker() {
			this.isRotate = false;
		},
		// 客资管理
		onBusiness() {
			this.$request({
				url: 'manage/setnotice',
				method: 'post',
				data: {
					shopId: this.shopList.id,
					type: 'customer'
				}
			}).then((res) => {
				const { code } = res.data;
				if (code == 1) {
					if (this.userInfo.identity == 3 && this.userInfo.positions == 1) {
						this.obj.isJob = 1;
						uni.navigateTo({
							url: '/pages/filePages/myClient/myClient?obj=' + JSON.stringify(this.obj)
						});
					} else {
						uni.navigateTo({
							url: '/pages/filePages/business/business?obj=' + JSON.stringify(this.obj)
						});
					}
				}
			});
		},
		//获取店铺列表
		getShopList() {
			this.$request({
				url: 'wedding/shop_list',
				method: 'POST',
				data: {
					keyword: '',
					type: 1,
					is_manager: 1
				}
			}).then((res) => {
				this.array = res.data.data;
				this.obj.shopId = this.array[0].id;
				this.obj.index = 0;
				this.is_photography = this.array[0].is_photography;
				this.getMemberData(this.obj.shopId);
				this.getNotice(this.obj.shopId);
			});
		},
		bindPickerChange: function (e) {
			this.index = e.detail.value;
			this.obj.shopId = this.array[this.index].id;
			this.getMemberData(this.obj.shopId);
			this.getNotice(this.obj.shopId);
			this.obj.index = this.index;
			this.is_photography = this.array[this.index].is_photography;
		},
		active(item) {
			this.shopList = {
				name: item.shopname,
				id: item.id
			};
			this.heightTwo = !this.heightTwo;
		},
		getRebate() {
			this.$request({
				url: 'team/getRebate',
				method: 'POST'
			}).then((res) => {
				if (res.statusCode == 200) {
					this.teamList = res.data.data.list;
				}
			});
		},
		dropDown(flag) {
			if (flag == 1) {
				this.height = !this.height;
			} else {
				this.heightTwo = !this.heightTwo;
			}
		},
		goOrderMan() {
			uni.navigateTo({
				url: `../orderManagement/orderManagement?shopList=${JSON.stringify(this.userInfo)}&shopType=${this.shopType}`
			});
		},
		goMyTeam(type) {
			let shopId = 0;
			if (this.shopList.id) {
				shopId = this.shopList.id;
			}
			uni.navigateTo({
				url: '/pages/bulletinBoard/bulletinBoard?type=' + type + '&id=' + shopId
			});
		},
		gotoOrderSh() {
			let that = this;
			this.$request({
				url: 'manage/setnotice',
				method: 'post',
				data: {
					shopId: this.shopList.id,
					type: 'recommen'
				}
			}).then((res) => {
				const { code } = res.data;
				if (code == 1) {
					uni.navigateTo({
						url: '/pages/filePages/orderReview/orderReview?index=' + this.obj.index + '&shopId=' + this.obj.shopId
					});
				}
			});
		},
		handleFinishRecharge() {
			this.$request({
				url: 'manage/setnotice',
				method: 'post',
				data: {
					shopId: this.shopList.id,
					type: 'recharge'
				}
			}).then((res) => {
				const { code } = res.data;
				if (code == 1) {
					uni.navigateTo({
						url: '/pages/memberManage/index?index=' + this.obj.index + '&shopId=' + this.obj.shopId
					});
				}
			});
		},
		//没啥卵用
		handleFinishOrder() {
			this.$request({
				url: 'manage/setnotice',
				method: 'post',
				data: {
					shopId: this.shopList.id,
					type: 'order'
				}
			}).then((res) => {
				const { code } = res.data;
				console.log('执行了点击事件');
				if (code == 1) {
					return;
				}
			});
		},
		handleFinishParent() {
			this.$request({
				url: 'manage/setnotice',
				method: 'post',
				data: {
					shopId: this.shopList.id,
					type: 'shopparent'
				}
			}).then((res) => {
				const { code } = res.data;
				if (code == 1) {
					return;
				}
			});
		}
	}
};
</script>

<style scoped lang="scss">
.administration {
	overflow: hidden;
	padding-bottom: 50upx;

	.head-box {
		background: linear-gradient(180deg, #e7cbab 0%, #e6dacd 100%);
		overflow: hidden;

		.personal_box {
			width: 100%;
			background: linear-gradient(#c78e4b 0%, #c88f4b 100%);
			box-shadow: 0upx 8upx 42upx 0upx rgba(132, 95, 49, 0.3);
			border-radius: 32upx 32upx 32upx 32upx;
			box-sizing: border-box;
			.bjt {
				background-image: url(@/static/personal/bjt.webp);
				background-repeat: no-repeat;
				background-size: auto 100%;
				padding-right: 40upx;
				padding-left: 36rpx;
			}
			.head_img {
				padding-bottom: 20rpx;
				border-bottom: 2rpx solid rgba(244, 244, 244, 0.3);
			}
			.personal_left_img {
				.avatar_box {
					width: 88upx;
					height: 88upx;
					box-shadow: 0upx 0upx 12upx 0upx #a86f28;
					border: 4upx solid #986e3d;
					border-radius: 50%;
					margin-top: 46upx;

					.avatar {
						border-radius: 50%;
					}
				}

				.name_detail_box {
					margin-left: 24upx;
					padding-top: 50upx;
					box-sizing: border-box;

					.name_txt {
						line-height: 42rpx;
						color: #fff;
					}

					.detail_box {
						color: #fff;
						margin-top: 4upx;
					}

					.position_txt {
						color: rgba(255, 255, 255, 0.8);
						margin-left: 16upx;
						margin-top: 4upx;
					}
				}
			}

			.personal_right_logo {
				width: 128upx;
				height: 50upx;
				margin-top: 60upx;
			}
		}

		.store_box {
			width: 686upx;
			height: 88upx;
			background: #ffffff;
			border-radius: 24upx;
			margin: 4rpx auto 20rpx;
			.store_logo {
				width: 44upx;
				height: 44upx;
				margin: 0 0 0 24upx;
			}

			.uni-input {
				flex: 1;
				margin-right: 10rpx;
				margin-left: 24upx;
				color: #333333;
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;
			}
			.store_name {
				color: #333;
				margin-left: 34upx;
				line-height: 88upx;
			}

			.senior_txt {
				color: #999;
				line-height: 88upx;
			}

			.arrows_icon {
				width: 16upx;
				height: 22upx;
				margin-left: 22upx;
			}
		}
	}

	.list {
		background-color: #ffffff;

		.list_box {
			width: 686upx;
			height: 156upx;
			justify-content: space-between;
			align-items: center;
			border-bottom: 1upx solid #f4f4f4;
			padding: 32upx 0 32upx 0;
			box-sizing: border-box;
			margin: 0 auto;

			.list_icon {
				width: 92upx;
				height: 92upx;
			}

			.list_detail {
				flex: 1;
				display: flex;
				justify-content: space-around;
				align-items: start;
				flex-direction: column;
				width: 364upx;
				height: 100%;
				margin-left: 24upx;
				box-sizing: border-box;

				.title_box {
					line-height: 44rpx;
					color: #333;
				}

				.introduce_txt {
					line-height: 36rpx;
					color: #999;
				}
			}

			.jian_right_icon {
				display: flex;
				justify-content: space-between;
				align-items: center;
			}
		}
	}
}
</style>
<style>
page {
	background-color: #ffffff;
}
</style>
